<template>
  <div class="image-wrap" @click="close">
    <div class="image-content">
      <img :src="imgurl"/>
    </div>
  </div>
</template>
<script type="text/ecmascript-6">
  export default {
    data() {
      return {
      };
    },
    methods: {
      close() {
        this.$emit('getimg', '');
      }
    },
    props: ['imgurl']
  };
</script>
<style lang="stylus" rel="stylesheet/stylus">
  .wrap
    img
      position inherit
  .image-wrap
    height 100%
    width 100%
    background-color rgba(33,33,33,0.8)
    position fixed
    top 0px
    z-index 1000
    .image-content
      border 1px solid $border
      margin 0 auto
      margin-top 30%
      img
        width 90%
        height auto
</style>